import React, { useContext } from 'react';
import { AppBar, Toolbar, Button, Typography } from '@mui/material';
import { Link } from 'react-router-dom';
import { AuthContext } from '../context/AuthContext';

function Navbar() {
  const { user, logout } = useContext(AuthContext);

  return (
    <AppBar position="static">
      <Toolbar>
        <Typography variant="h6" style={{ flexGrow: 1 }}>
          Система планирования графиков
        </Typography>
        {user ? (
          <>
            <Button color="inherit" component={Link} to="/radiologists">Врачи</Button>
            <Button color="inherit" component={Link} to="/schedule">График работы</Button>
            {/* <Button color="inherit" component={Link} to="/workload-prediction">Прогноз нагрузки</Button> */}
            <Button color="inherit" component={Link} to="/forecast">Прогноз нагрузки</Button>
            <Button color="inherit" onClick={logout}>Выход</Button>
          </>
        ) : (
          <Button color="inherit" component={Link} to="/login">Войти</Button>
        )}
      </Toolbar>
    </AppBar>
  );
}

export default Navbar;